<template>
<!-- APP版本控制 begin -->
<div class="main main-version" id="main_version">
	<div class="main-bd">
		<div class="content-wrap">
			<div>
				<div style="margin: 10px 0;">
					<Input  placeholder="订单编号" v-model="orderNum" class="w200" ></Input>
					<Input  placeholder="用户姓名" v-model="name" class="w200" ></Input>
					<Input  placeholder="电话" v-model="cellphone" class="w200" ></Input>
					
					<Select v-model="loanDay" class="w200">
						<Option :value="-1">借款期限</Option>
						<Option :value="7">7天</Option>
						<Option :value="14">14天</Option>
					</Select>
					
					<DatePicker type="daterange" format="yyyy-MM-dd" :options="disDate" @on-change="beginTimeChange" @on-clear="clearDate(1)" placeholder="借款时间" style="width: 200px"></DatePicker>
					
					<DatePicker type="daterange" format="yyyy-MM-dd" :options="disDate" @on-change="passTimeChange" @on-clear="clearDate(2)" placeholder="应还时间" style="width: 200px"></DatePicker>
					
					<DatePicker type="daterange" format="yyyy-MM-dd" :options="disDate" @on-change="outAddTimeChange" @on-clear="clearDate(3)" placeholder="委外时间" style="width: 200px"></DatePicker>
			    </div>
				
			 <table class="table table-hover table-condensed">
				<thead><tr>
					<td>订单编号</td>
					<td>借款时间</td>
					<td>姓名</td>
					<td>电话</td>
					<td>借款金额</td>
					<!-- <td>借款期限</td> -->
					<td>应还时间</td>
					<td>综合费用</td>
					<td>逾期天数</td>
					<td>逾期罚息</td>
					<td>违约金</td>
					<td>应还总额</td>
					<td>委外时间</td>
					<td>还款时间</td>
					<td>操作</td>
				</tr></thead>
				<tr v-for="item in getCreditOrderList"> 
					<td>{{item.orderNum}}</td>
					<td>{{item.orderTime | getLocalTime}}</td>
					<td>{{item.name}}</td>
					<td>{{item.cellphone}}</td>
					<td>{{item.primeCost}}</td>
					<!-- <td>{{item.loanDay}}天</td> -->
					<td>{{item.latestPaymentDate | getLocalTime(1)}}</td>
					<td>{{item.serviceFee + item.interest}}</td>
					<td>{{item.yuqiDay}}</td>
					<td>{{item.penal}}</td>
					<td>{{item.interestOfDemurrage}}</td>
					<td>{{item.money}}</td>
					<td>{{item.outAddTime | getLocalTime}}</td>
					<td>{{ item.paymentDate }}</td>
					<td>
						<Button type="primary" size="small" @click="overModal = true,getRemarkForUserId = item.userId,lockUrgeOrderOrderId=item.orderId">备注</Button>
						<Button type="success" size="small" @click="identifyInfo(item.userId)">详情</Button>
					</td>
				</tr>
				</table>
				
				<div style="float: right;margin-top:20px;text-align: right;">
					<span class="kkpager_totalSize">共有{{loan_list_size}}条数据</span>
					<Page :total="loan_list_size" :page-size="20"  @on-change="pageChange" show-elevator style="margin: 15px 0;"></Page>
				</div>
			</div>
		</div>
		
			<Modal
				v-model="info.idenfityModal"
				title="认证详情"
				width="1200">
				<Identifyinfo :userId="info.userId" :idenfityList="info.idenfityList" :phoneList="info.phoneList"></Identifyinfo>
			</Modal>
			
			<Modal
				v-model="overModal"
				title="版本记录详情"
				width="1200">
				<div v-for="item in getRemarks">
					<p>{{item.remarkTime | getLocalTime}}</p>
					<div>
						<Input disabled type="textarea" :value="item.remark" style="color: #000000;"></Input>
					</div>
				</div>
				<div>
					<p>请在下面输入你需要备注的信息:</p>
					<div>
						<Input v-model="remarkInput" type="textarea"></Input>
					</div>
					<p>
						<Button type="success" @click="addCollectionRemark" class="btnClass">添加备注</Button>
					</p>
				</div>
			</Modal>
			
			
	</div>
</div>
<!-- APP版本控制 end -->
</template>

<script>
import Identifyinfo from './identifyInfo';
export default{
	data(){
		return{
			getCreditOrderList:[],
			getRemarks:[],
			orderNum:'',
			name:'',
			cellphone:'',
			loanDay:-1,
			beginOrderTime:'',
			endOrderTime:'',
			beginPassTime:'',
			endPassTime:'',
			start_OutAddTime:'',
			end_OutAddTime:'',
			yuqiDay:-1,
			page:1,
			loan_list_size: 1,
			loan_list_page: 1,
			loading: true,
			overModal:false,
			getRemarkForUserId:'',
			lockUrgeOrderOrderId:'',
			managerList:[],
			remarkInput:'',
			level:localStorage.level,
			disDate: {
				disabledDate (date) {
					return date && date.valueOf() > Date.now();
				}
			},
			info:{
				idenfityModal:false,
				collapseMo:'',
				idenfityList:[],
				phoneList:[],
				userId: ''
			}
		}
	},
	components: {Identifyinfo},
	methods:{
		getExceptionUrgeOrders(page) {
		   	var _this = this;
		   	var param = {};
		   	param.orderNum = _this.orderNum;
		   	param.name = _this.name;
		   	param.cellphone = _this.cellphone;
		   	param.loanDay = _this.loanDay;
		   	param.startOrderTime = _this.beginOrderTime;
		   	param.endOrderTime = _this.endOrderTime;
		   	param.startLatestPaymentDate = _this.beginPassTime;
		   	param.endLatestPaymentDate = _this.endPassTime;
		   	param.startOutAddTime = _this.start_OutAddTime;
		   	param.endOutAddTime = _this.end_OutAddTime;
		   	param.page = page || 1;
		    this.$http.post('/helsinki/admin/collection/getCollectionOutDataList',param).then(function(res){
		    if (res.data.errcode == 0) {
		        _this.getCreditOrderList = res.data.data.list;
		        _this.managerList =res.data.data.managerList;
		        _this.loan_list_size = res.data.data.size;
				_this.loan_list_page = param.page;
				_this.loading = false;
		    }
		    },function(res){
				_this.$Message.info(res.data.info);
			});
		},
		identifyInfo:function(userId){
			var _this =this;
			_this.info.idenfityModal = true;
			this.$http.post('/helsinki/admin/collection/getUrgeOrderUserInfo',{userId:userId}).then(function(res){
		    if (res.data.errcode == 0) {
		        _this.info.idenfityList = res.data.data.info;
		        _this.info.phoneList = res.data.data.phoneList;
		        _this.info.userId = userId;
		    }
		    },function(res){
				_this.$Message.info(res.data.info);
			});
		},
		queryCollectionRemarks:function(){//获取催收日志
			var _this =this;
			this.$http.post('/helsinki/admin/collection/queryCollectionRemarks',{userId:_this.getRemarkForUserId}).then(function(res){
		    if (res.data.errcode == 0) {
		        _this.getRemarks = res.data.data.remarks;
		    }
		    },function(res){
				_this.$Message.info(res.data.info);
			});
		},
		addCollectionRemark:function(){//添加备注信息
			var _this = this;
			$.post('/helsinki/admin/collection/addCollectionRemark',{
				 userId: _this.getRemarkForUserId,
        		 remark: _this.remarkInput
			},function(res) {
				if (res.errcode == 0) {
			        _this.$Message.info(res.info);
			        _this.overModal = false;
			        _this.remarkInput = '';
			    }else{
			    	_this.$Message.info(res.info);
			    }
			});
		},
		userDataShow:function(cellphone,type){
			$.post('/helsinki/admin/collection/getOrderLogAndContract',{cellphone:cellphone},function(res) {
				if (res.errcode == 0) {	
					var list = res.data.list;
					var phoneListText='';
					//认证信息
					if (list != '') {
						$.each(list,function(i,identificateOrder){
						var id = identificateOrder.id,
							userId=identificateOrder.userId,
							cellphone = identificateOrder.cellphone || '--',
							contractNumber = identificateOrder.contractNumber || '--',
							fatherName = identificateOrder.fatherName || '--',
							fatherPhone = identificateOrder.fatherPhone || '--',
							fatherPhoneCount = identificateOrder.fatherPhoneCount,
							motherName = identificateOrder.motherName || '--',
							motherPhone = identificateOrder.motherPhone || '--',
							motherPhoneCount = identificateOrder.motherPhoneCount,
							name = identificateOrder.name || '--',
							IDUpPicUrl = identificateOrder.IDUpPicUrl, //身份证正面
							IDDownPicUrl = identificateOrder.IDDownPicUrl, //身份证反面
							IDNumber = identificateOrder.IDNumber || '--', //身份证号码
							picUrl1=identificateOrder.picUrl1,//抓拍照1
							picUrl2=identificateOrder.picUrl2,//抓拍照2
							limitMoney = identificateOrder.limitMoney || 0,//总信用额度
							availableMoney = identificateOrder.availableMoney || 0,//总可用额度
							creditLimitMoney = identificateOrder.creditLimitMoney,//白条信用额度
							creditAvailableMoney = identificateOrder.creditAvailableMoney,//白条可用额度
							state = identificateOrder.state;
						//照片信息
						var picUrlArr = [IDUpPicUrl,IDDownPicUrl,picUrl1,picUrl2],
						picDescArr = ['身份证正面照片（必填）','身份证反面照片（必填）','抓拍照1','抓拍照2'],
						picList = '';
						for (var i = 0,len = picUrlArr.length; i < len; i++) {
							if (picUrlArr[i] != '' && picUrlArr[i] != null) {
								picList += '<li><p>' + picDescArr[i] + '</p><a href="' + picUrlArr[i] + '" target="_blank"><img src="' + picUrlArr[i] + '?imageMogr2/thumbnail/300x/strip/quality/80/format/jpg" alt="' + picDescArr[i] + '" width="100%"></a></li>';
							}
						}
						//信用额度
						var moneyText = '';
						if (state == 7) { //认证成功
							moneyText = '<h4>额度信息</h4><ul><li><span>总信用额度：￥</span>' + commafy(limitMoney) 
							+ '</li><li><span>总可用额度：￥</span>' + commafy(availableMoney) 
							+ '</li><li><span>白条信用额度：￥</span>' + commafy(creditLimitMoney) 
							+ '</li><li><span>白条可用额度：￥</span>' + commafy(creditAvailableMoney) 
							+ '</li></ul>';
						}
						
						var sexID=IDNumber.charAt(16),
						sexText=sexID?sexID%2?"男":"女":"0";
						
						var order_detail = '<p>合同编号：<strong>' + contractNumber 
							+ '</strong></p><h4>个人信息</h4><ul><li><span>姓名：</span>' + name 
							+ '</li><li><span>性别：</span>' + sexText 
							+ '</li><li><span>电话：</span>' + cellphone 
							+ '</li><li class="block"><span>身份证号码：</span>' + IDNumber 
							+ '</li></ul>'
							+ '<h4>联系人信息</h4><ul><li><span>父亲姓名：</span>' + fatherName + '</li>'
							+ '<li><span>父亲电话：</span>' + fatherPhone + '<span style="color: red;">（出现次数：' + fatherPhoneCount + '）</span></li>'
							+ '<li><span>母亲姓名：</span>' + motherName + '</li>'
							+ '<li><span>母亲电话：</span>' + motherPhone + '<span style="color: red;">（出现次数：' + motherPhoneCount + '）</span></li>'
							+ '</ul>'
							+ '<h4>照片信息</h4><ul class="pic-list">'
							+ picList + '</ul>'
							+ moneyText
							+ '</div>';
						$('#userDataShow_list_'+type).html(order_detail);
													
						});
						$.post(base_url + 'getOrderLogAndContract', {
						    userId: userId
						},function(res) {
						    var phoneList = res.data.phoneList,
						    identificateOrderLoger = res.data.identificateOrderLoger;
						    var phone_tr = '';
						if (phoneList != '' && phoneList != null) { // 通讯录列表
						    $.each(phoneList,function(i, item) {
						        var userName = item.userName,
						        phoneNumber = item.phoneNumber;
						        phone_tr += '<tr><td>' + userName + '</td> <td>' + phoneNumber + '</td></tr>';
						    });
						    phoneListText = '<h4>用户通讯录列表</h4><div class="block" id="pk_phoneList_list" style="margin:10px;">' 
						    + '<button type="button" class="btn btn-primary" data-toggle="collapse" data-target="#openList">通讯录列表</button>' 
						    + '<button type="button" class="btn btn-success" onclick="phoneListExcel()" style="margin-left:15px;">导出通讯录</button>' 
						    + '<div id="openList" class="collapse" style="margin-top:10px;"><table class="table table-hover table-condensed phoneListTable2excel"><thead><tr><td>姓名</td><td>电话</td></tr></thead>' + phone_tr + '</table></div></div>';
						    $('#userDataShow_list_'+type).append(phoneListText);
						}
						});
						
						$('#userDataShow_'+type).modal('show');
					} else {
						$('#user_identificate_order_list').html('<span class="null-tips">暂无认证信息</span>');
					}
				}
			})
		},
		beginTimeChange(e){
			if(typeof(e)=="object"){
				this.beginOrderTime = e[0];
				this.endOrderTime = e[1];
			}else{
				this.beginOrderTime = '';
				this.endOrderTime = '';
			}
		},
		clearDate(state){
			if(state == 1){
				this.beginOrderTime = '';
				this.endOrderTime = '';
			}else if(state == 2){
				this.beginPassTime = '';
				this.endPassTime = '';
			}else{
				this.start_OutAddTime = '';
				this.end_OutAddTime = '';
			}
		},
		passTimeChange(e){
			if(typeof(e)=="undefined"){
				this.beginPassTime = e[0];
			}else if(typeof(e)=="object"){
				this.beginPassTime = e[0];
				this.endPassTime = e[1];
			}
		},
		outAddTimeChange(e){
			if(typeof(e)=="undefined"){
				this.start_OutAddTime = e[0];
			}else if(typeof(e)=="object"){
				this.start_OutAddTime = e[0];
				this.end_OutAddTime = e[1];
			}
		},
		pageChange(e){
			this.getExceptionUrgeOrders(e);
		}
	},
	mounted:function(){
		this.getExceptionUrgeOrders();
	},
	watch:{//检测v-model组件变化
		orderNum:function(){
			this.getExceptionUrgeOrders();
		},
		name:function(){
			this.getExceptionUrgeOrders();
		},
		cellphone:function(){
			this.getExceptionUrgeOrders();
		},
		loanDay:function(){
			this.getExceptionUrgeOrders();
		},
		beginOrderTime:function(){
			this.getExceptionUrgeOrders();
		},
		beginPassTime:function(){
			this.getExceptionUrgeOrders();
		},
		start_OutAddTime:function(){
			this.getExceptionUrgeOrders();
		},
		overModal:function(){
			if(this.overModal == true){
				this.queryCollectionRemarks();
			}
		}
	}
}
</script>

<style>
	@import '../static/style.css';
	.table tr{
	    vertical-align: middle;
	    border: 1px solid #e6e6e6;
	}
	.table tr td{
		vertical-align: middle;
		border-right: 2px solid #fff;
	}
	.floatRight{
		float: right;
		margin-top: -50px;
		margin-right: 30px;
	}
	
	.w200{
		width: 200px;
	}
	.ivu-input[disabled], fieldset[disabled] .ivu-input {
	    background-color: #f3f3f3;
	    opacity: 1;
	    cursor: not-allowed;
	    color: #000000;
	}
	.btnClass{
		margin: 20px 0;
		margin-right: 20px;
	}
	.ml10{
		margin-left: 10px;
	}
</style>